
<!--
	Author: W3layouts
	Author URL: http://w3layouts.com
	License: Creative Commons Attribution 3.0 Unported
	License URL: http://creativecommons.org/licenses/by/3.0/
	-->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>胡伟强个人主页</title>
<link rel="shortcut icon" href="./images/logo.png" type="image/x-icon" />
<link href="./css/bootstrap.css" rel='stylesheet' type='text/css' />
<!-- Custom Theme files -->
<link href="./css/style.css" rel="stylesheet" type="text/css"
	media="all" />
<!-- Custom Theme files -->
<script src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js"
	type="text/javascript"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="application/x-javascript">
	
	
	 addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } 


</script>
<!--webfont-->
<link
	href='http://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700'
	rel='stylesheet' type='text/css'>
<link
	href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900,200italic,300italic,400italic,600italic,700italic,900italic'
	rel='stylesheet' type='text/css'>
<script type="text/javascript" src="./js/move-top.js"></script>
<script type="text/javascript" src="./js/easing.js"></script>
<script type="text/javascript">
	jQuery(document).ready(function($) {
		$(".scroll").click(function(event) {
			event.preventDefault();
			$('html,body').animate({
				scrollTop : $(this.hash).offset().top
			}, 1200);
		});
	});

	function prompt() {
		var isChrome = window.navigator.userAgent.indexOf("Chrome") !== -1;
		if (!isChrome) {
			alert("建议用chrom浏览器浏览此网页");
		}
	}
	var browser_width = $(document.body).width();
	$("div.header").css("width", browser_width);
	$(window).resize(function() {
		browser_height = window.innerHeight;
		$("div.header").css("height", browser_height);
		$("div.header-banner").css("height", browser_height);
		//alert("我执行了！"+ browser_width+);
	});
	window.onload = prompt;
</script>
</head>
<body>
	<!-- header-section-starts -->
	<div class="header">
		<div class="header-banner">
			<div class="container">
				<div class="top-menu">
					<div class="clearfix">
						<ul>
							<li><a href="#ABOUT" class="scroll">关于我</a></li>
							<li><a href="#WORK" class="scroll">作品/项目</a></li>
							<li><a href="#BLOG" class="scroll">个人博客</a></li>
							<li><a href="#CONTACT" class="scroll">快联系我</a></li>
							<li><a href="tanchishe.html"  target="target_blank">贪吃蛇游戏</a></li>
						</ul>
					</div>
				</div>
				<!--script-nav-->
				<script>
					$("span.menu").click(function() {
						$(".top-menu ul").slideToggle("slow", function() {
						});
					});
				</script>
				<div class="header-banner-info text-center">
					<a href="#"><img src="./images/logo.png" alt="" /></a>
					<h3>您好</h3>
					<h3>欢迎访问我的个人主页</h3>
					<p>我是一名程序猿</p>
					<ul class="details">
						<li>年龄 : <a href="#">22</a></li>
						<li>国家 : <a href="#">中国</a></li>
						<li>工作城市 : <a href="#">上海</a></li>
					</ul>
				</div>
			</div>
		</div>
	</div>
	<!-- header-section-ends -->
	<!-- content-section-starts -->
	<div class="content-section">
		<!-- about-section-starts -->
		<div class="about-section" id="ABOUT">
			<div class="container">
				<div class="about-section-head text-center">
					<img src="./images/head.png" alt="" />
					<h3>关于我</h3>
					<label></label>
					<p>Do you want to know me?</p>
				</div>
				<div class="about-section-grids">
					<div class="col-md-4 about-section-grid-1">
						<h4>个人简介</h4>
						<p>
							姓名：胡伟强 性别：男 Tel：18521595797 <br>Email：weiqianghu_ecust@163.com
						</p>
						<p>籍贯：甘肃 平凉 政治面貌：中共党员</p>
						<p>学习经历</p>
						<p>华东理工大学 计算机科学与技术 本科 2012.9——2016.6</p>
						<p>所获奖项</p>
						<p>
							国家励志奖学金（两次） 2013.9、2014.9 <br>华东理工大学综合课程奖学金（两次）
							2013.9、2014.9 <br>上海市计算机应用能力大赛优胜奖 2015.5 <br>热带风暴优秀学生员工称号
							2014.11
						</p>
					</div>
					<div class="col-md-4 about-section-grid-2 text-center">
						<img src="./images/hwq.jpg" class="img-responsive" alt="" />
					</div>
					<div class="col-md-4 about-section-grid-3">
						<h4>掌握技术</h4>
						<p>后台语言</p>
						<div class="progress-grid">
							<div class="meter red">
								<span style="width: 75%;">
									<div class="progress_desc">java</div>
									<div class="percent">熟悉</div>
									<div class="clearfix"></div>
								</span>
							</div>
							<div class="meter animate">
								<span style="width: 70%;"><div class="progress_desc">C</div>
									<div class="percent">熟悉</div>
									<div class="clearfix"></div> </span>
							</div>
							<div class="meter">
								<span style="width: 70%;"><div class="progress_desc">MySql</div>
									<div class="percent">熟悉</div>
									<div class="clearfix"></div> </span>
							</div>
							<div class="meter">
								<span style="width: 55%;"><div class="progress_desc">c#</div>
									<div class="percent">了解</div>
									<div class="clearfix"></div> </span>
							</div>
						</div>
						<p>前端语言</p>
						<div class="progress-grid">
							<div class="meter red">
								<span style="width: 70%;">
									<div class="progress_desc">HTML / HTML5</div>
									<div class="percent">熟悉</div>
									<div class="clearfix"></div>
								</span>
							</div>
							<div class="meter animate">
								<span style="width: 65%;"><div class="progress_desc">CSS
										/ CSS3</div>
									<div class="percent">熟悉</div>
									<div class="clearfix"></div> </span>
							</div>
							<div class="meter">
								<span style="width: 55%;"><div class="progress_desc">JavaScript
										/ jquery</div>
									<div class="percent">了解</div>
									<div class="clearfix"></div> </span>
							</div>
						</div>
					</div>
					<div class="clearfix"></div>
				</div>
			</div>
		</div>
		<!-- about-section-ends -->
		<!-- portfolio-section-starts -->
		<div class="portfolio-section" id="WORK">
			<div class="portfolio-section-top-row">
				<div class="container">
					<div class="portfolio-section-head text-center">
						<h3>作品/项目经验</h3>
						<label></label>
						<p>Do you want to know me?</p>
					</div>
					<div class="col-md-4 portfolio-section-top-row-left-grid">
						<div class="project-name">
							<a href="http://cleme.aliapp.com/" target="target_blank"><h3>吃了么网上点餐系统(点我)</h3></a>
						</div>
						<div class="project-description">
							<span>时间：2015.2——2015.4</span>
						</div>

						<div class="project-name">
							<a href="http://www.ouruniversity.com.cn/" target="target_blank"><h3>你好大学(点我)</h3></a>
						</div>
						<div class="project-description">
							<span>时间：2015.4——2015.6</span>
						</div>

						<div class="project-name">
							<a href="#" target="target_blank"><h3>医药通网上卖药系统</h3></a>
						</div>
						<div class="project-description">
							<span>时间：2015.3——2015.6</span>
						</div>

						<div class="project-name">
							<a
								href="http://blog.csdn.net/weiqianghu/article/details/46640403"
								target="target_blank"><h3>Linux Shell(点我)</h3></a>
						</div>
						<div class="project-description">
							<span>时间：2015.6</span>
						</div>
					</div>
					<div class="col-md-8 portfolio-section-top-row-right-grid">
						<div class="wmuSlider example1 section" id="section-1">
							<article style="position: absolute; width: 100%; opacity: 0;">
								<img style="width: 730px; height: 456.25px"
									src="./images/img1.jpg" class="img-responsive" alt="">
							</article>
							<article style="position: absolute; width: 100%; opacity: 0;">
								` <img style="width: 730px; height: 456.25px"
									src="./images/img2.jpg" class="img-responsive" alt="">
							</article>
							<article style="position: absolute; width: 100%; opacity: 0;">
								<img style="width: 730px; height: 456.25px"
									src="./images/img3.jpg" class="img-responsive" alt="">
							</article>
							<ul class="wmuSliderPagination">
								<li><a href="#" class="">0</a></li>
								<li><a href="#" class="">1</a></li>
								<li><a href="#" class="">2</a></li>
							</ul>

						</div>

						<!-- script -->
						<script src="./js/jquery.wmuSlider.js"></script>
						<script>
							$('.example1').wmuSlider();
						</script>
						<!-- script -->

					</div>
					<div class="clearfix"></div>
				</div>
			</div>
			<div class="portfolio-section-bottom-row" id="portfolio">
				<div class="container">
					<ul id="filters" class="clearfix">
						<li><span class="filter active"
							data-filter="app card icon web logo1">全部</span></li>
						<li><span class="filter" data-filter="app">吃了么网上点餐系统</span></li>
						<li><span class="filter" data-filter="card">你好大学</span></li>
						<li><span class="filter" data-filter="icon">医药通网上卖药系统</span></li>
						<li><span class="filter" data-filter="logo1">Linux
								Shell</span></li>
					</ul>
					<div id="portfoliolist">
						<div class="portfolio card mix_all  wow bounceIn"
							data-wow-delay="0.4s" data-cat="card"
							style="display: inline-block; opacity: 1;">
							<div class="portfolio-wrapper">
								<a href="#small-dialog"
									class="b-link-stripe b-animate-go  thickbox play-icon popup-with-zoom-anim">
									<img src="./images/pic-1.jpg" class="img-responsive" alt="" />
									<div class="b-wrapper">
										<h2 class="b-animate b-from-left    b-delay03 ">
											&nbsp&nbsp&nbsp你好大学&nbsp&nbsp&nbsp<img
												src="./images/icon-eye.png" alt="" />
										</h2>
									</div>
								</a>
							</div>
						</div>
						<div class="portfolio app mix_all  wow bounceIn"
							data-wow-delay="0.4s" data-cat="app"
							style="display: inline-block; opacity: 1;">
							<div class="portfolio-wrapper">
								<a href="#small-dialog1"
									class="b-link-stripe b-animate-go  thickbox play-icon popup-with-zoom-anim">
									<img src="./images/pic-2.jpg" class="img-responsive" alt="" />
									<div class="b-wrapper">
										<h2 class="b-animate b-from-left    b-delay03 ">
											吃了么网上点餐系统<img src="./images/icon-eye.png" alt="" />
										</h2>
									</div>
								</a>
							</div>
						</div>
						<div class="portfolio icon mix_all  wow bounceIn"
							data-wow-delay="0.4s" data-cat="icon"
							style="display: inline-block; opacity: 1;">
							<div class="portfolio-wrapper">
								<a href="#small-dialog3"
									class="b-link-stripe b-animate-go  thickbox play-icon popup-with-zoom-anim">
									<img src="./images/pic-4.jpg" class="img-responsive" alt="" />
									<div class="b-wrapper">
										<h2 class="b-animate b-from-left    b-delay03 ">
											医药通网上卖药系统<img src="./images/icon-eye.png" alt="" />
										</h2>
									</div>
								</a>
							</div>

						</div>
						<div class="portfolio logo1 mix_all  wow bounceIn"
							data-wow-delay="0.4s" data-cat="logo1"
							style="display: inline-block; opacity: 1;">
							<div class="portfolio-wrapper">
								<a href="#small-dialog7"
									class="b-link-stripe b-animate-go  thickbox play-icon popup-with-zoom-anim">
									<img src="./images/pic-8.jpg" class="img-responsive" alt="" />
									<div class="b-wrapper">
										<h2 class="b-animate b-from-left    b-delay03 ">
											&nbsp&nbsp&nbspLinux shell&nbsp&nbsp&nbsp<img
												src="./images/icon-eye.png" alt="" />
										</h2>
									</div>
								</a>
							</div>
						</div>

						<div class="clearfix"></div>
					</div>
					<div class="clearfix"></div>

					<script type="text/javascript">
						jQuery(document).ready(function($) {
							$(".scroll").click(function(event) {
								event.preventDefault();
								$('html,body').animate({
									scrollTop : $(this.hash).offset().top
								}, 1200);
							});
						});
					</script>
					<!-- Script for gallery Here -->
					<script type="text/javascript" src="./js/jquery.mixitup.min.js"></script>
					<script type="text/javascript">
						$(function() {

							var filterList = {

								init : function() {

									// MixItUp plugin
									// http://mixitup.io
									$('#portfoliolist').mixitup({
										targetSelector : '.portfolio',
										filterSelector : '.filter',
										effects : [ 'fade' ],
										easing : 'snap',
										// call the hover effect
										onMixEnd : filterList.hoverEffect()
									});

								},

								hoverEffect : function() {

									// Simple parallax effect
									$('#portfoliolist .portfolio').hover(
											function() {
												$(this).find('.label').stop()
														.animate({
															bottom : 0
														}, 200, 'easeOutQuad');
												$(this).find('img').stop()
														.animate({
															top : -30
														}, 500, 'easeOutQuad');
											},
											function() {
												$(this).find('.label').stop()
														.animate({
															bottom : -40
														}, 200, 'easeInQuad');
												$(this).find('img').stop()
														.animate({
															top : 0
														}, 300, 'easeOutQuad');
											});

								}

							};

							// Run the show!
							filterList.init();

						});
					</script>
					<!-- Gallery Script Ends -->
					<!-- pop-up-box -->
					<script type="text/javascript" src="./js/modernizr.custom.min.js"></script>
					<link href="./css/popuo-box.css" rel="stylesheet" type="text/css"
						media="all" />
					<script src="./js/jquery.magnific-popup.js" type="text/javascript"></script>
					<!-- //pop-up-box -->
					<div id="small-dialog" class="mfp-hide">
						<div style="background-color: #272822; color: #fff">

							<div>
								<h3>你好大学</h3>
							</div>
							<div class="address">
								<span>项目职责描述</span>

								<ul>
									<li>网站前端开发</li>
									<li>与后端同学沟通</li>
									<li>网站风格把握</li>
								</ul>

								<span>项目详细描述</span>

								<ul>
									<li>项目成员：8人</li>
									<li>成果：上千名top100高校志愿者入驻</li>
									<li>开发工具：eclipse，tomcat，mysql，MVC</li>
								</ul>
							</div>
							<div class="address">
								<span>项目展示地址</span> <a href="http://daxuewen.xyz/"
									target="target_blank">http://daxuewen.xyz/</a>
							</div>
						</div>
					</div>
					<div id="small-dialog1" class="mfp-hide">
						<div style="background-color: #272822; color: #fff">

							<div>
								<h3>吃了么网上点餐系统</h3>
							</div>
							<div class="address">
								<span>项目职责描述</span>

								<ul>
									<li>java后台编码</li>
									<li>Sql语句优化</li>
									<li>数据库整体设计</li>
								</ul>

								<span>项目详细描述</span>

								<ul>
									<li>项目成员：3人</li>
									<li>成果：获上海市计算机应用能力大赛优胜奖</li>
									<li>开发工具：eclipse，tomcat，mysql，MVC</li>
								</ul>
							</div>
							<div class="address">
								<span>网站地址</span> <a href="http://cleme.aliapp.com/"
									target="target_blank">http://cleme.aliapp.com/</a>
							</div>
						</div>
					</div>
				</div>

				<div id="small-dialog3" class="mfp-hide">
					<div style="background-color: #272822; color: #fff">

						<div>
							<h3>医药通网上卖药系统</h3>
						</div>
						<div class="address">
							<span>项目职责描述</span>

							<ul>
								<li>项目手机客户端开发</li>
								<li>实现设计师的想法</li>
								<li>与后端开发同学沟通，共同完成项目</li>
							</ul>
							<span>项目详细描述</span>

							<ul>
								<li>开发工具：eclipse，tomcat，mysql，MVC</li>
							</ul>
						</div>
					</div>
				</div>
			</div>
			<div id="small-dialog7" class="mfp-hide">
				<div style="background-color: #272822; color: #fff">

					<div>
						<h3>Linux shell</h3>
					</div>
					<div class="address">
						<span>项目职责描述</span>

						<ul>
							<li>shell开发</li>
							<li>函数设计、实现</li>
							<li>程序测试</li>
						</ul>

						<span>项目详细描述</span>

						<ul>
							<li>项目成员：1人</li>
							<li>开发工具：gedit，gcc</li>
						</ul>
					</div>
					<div class="address">
						<span>项目展示地址</span> <a
							href="http://blog.csdn.net/weiqianghu/article/details/46640403"
							target="target_blank">http://blog.csdn.net/weiqianghu/article/details/46640403</a>
					</div>
				</div>
			</div>
		</div>
		<script>
			$(document).ready(function() {
				$('.popup-with-zoom-anim').magnificPopup({
					type : 'inline',
					fixedContentPos : false,
					fixedBgPos : true,
					overflowY : 'auto',
					closeBtnInside : true,
					preloader : false,
					midClick : true,
					removalDelay : 300,
					mainClass : 'my-mfp-zoom-in'
				});

			});
		</script>
	</div>
	</div>
	</div>
	<!-- portfolio-section-ends -->
	<!-- blog-section-starts -->
	<div class="blog-section" id="BLOG">
		<div class="container" style="margin-bottom: 50px">
			<div class="blog-section-head text-center">
				<h3>个人博客</h3>
				<label></label>
				<p>Recent blog writings</p>
			</div>
			<div class="blog-section-grids">
				<div class="col-md-9 blog-section-left-grid">
					<div class="blog-section-banner">
						<a target="target_blank" href="http://blog.csdn.net/weiqianghu"><img
							src="./images/blog.jpg" class="img-responsive" alt="" /></a>
					</div>
				</div>
				<div class="col-md-3 blog-section-right-grid">
					<div class="search">
						<h5>搜索</h5>
						<div class="search-box">
							<form action="http://so.csdn.net/so/search/s.do">
								<input type="text" class="text" name="q" value="search"
									onfocus="this.value = '';"
									onblur="if (this.value == '') {this.value = 'search';}">
								<input type="submit" value>
							</form>
						</div>
					</div>
					<div class="clearfix"></div>
					<div class="categories">
						<h5>类别</h5>
						<ul>
							<li><a target="target_blank"
								href="http://blog.csdn.net/weiqianghu/article/category/5611733">排序算法</a></li>
							<li><a target="target_blank"
								href="http://blog.csdn.net/weiqianghu/article/category/5611175">c/c++</a></li>
							<li><a target="target_blank"
								href="http://blog.csdn.net/weiqianghu/article/category/5610729">面试题</a></li>
						</ul>
					</div>
				</div>
				<div class="clearfix"></div>
			</div>
		</div>
	</div>
	<!-- blog-section-ends -->
	<div class="twitter-section">
		<div class="course_demo">
			<ul id="flexiselDemo3">
				<li>
					<p style="padding-top: 40px">这个世界不是因为你能做什么，而是你该做什么</p>
				</li>
				<li>
					<p style="padding-top: 40px">短暂的激情是不值钱的，只有持久的激情才是赚钱的</p>
				</li>
				<li>
					<p style="padding-top: 40px">聪明是智慧者的天敌，傻瓜用嘴讲话，聪明的人用脑袋讲话，智慧的人用心讲话</p>
				</li>
			</ul>

		</div>
	</div>

	<script type="text/javascript">
		$(window).load(function() {
			$("#flexiselDemo3").flexisel({
				visibleItems : 1,
				animationSpeed : 1000,
				autoPlay : false,
				autoPlaySpeed : 3000,
				pauseOnHover : true,
				enableResponsiveBreakpoints : true,
				responsiveBreakpoints : {
					portrait : {
						changePoint : 480,
						visibleItems : 1
					},
					landscape : {
						changePoint : 640,
						visibleItems : 1
					},
					tablet : {
						changePoint : 768,
						visibleItems : 1
					}
				}
			});

		});
	</script>
	<script type="text/javascript" src="./js/jquery.flexisel.js"></script>

	<!-- content-section-starts -->
	<div class="contact-section text-center" id="CONTACT">
		<div class="container">
			<div class="contact-section-head">
				<h3>快联系我</h3>
				<label></label>
				<p>Recent blog writings</p>
			</div>
			<div class="contact-info">
				<ul>
					<li><i class="message"></i></li>
					<li><i>weiqianghu_ecust@163.com</i></li>
					<li><i class="phone"></i></li>
					<li>18521595797</li>
				</ul>
				<form id="sendemail">
					<input type="text" class="text" value="你的姓名" name="name" id="name"
						onfocus="this.value = ''"
						onblur="if (this.value == '') {this.value = '你的姓名';}"> <input
						type="text" class="text" value="你的Email" name="emailAddress"
						id="emailAddress" onfocus="this.value = ''"
						onblur="if (this.value == '') {this.value = '你的Email';}">
					<textarea onfocus="if(this.value == '你的 Message') this.value=''"
						name="content" id="content"
						onblur="if(this.value == '') this.value='你的 Message';">你的 Message</textarea>
					<input type="button" value="发送" id="sendSubmit"
						onclick="sendRequest()">
				</form>
			</div>
		</div>
	</div>
	</div>
	<script type="text/javascript">
		function sendRequest() {
			var myreg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
			var name=document.getElementById("name").value.trim();
			var emailAddress=document.getElementById("emailAddress").value.trim();
			var content=document.getElementById("content").value.trim();
			
			if (name == "你的姓名") {
				alert("姓名不能为空");
				document.getElementById("name").focus();
				return false;
			}
			if (emailAddress == "你的Email") {
				alert("邮箱不能为空");
				document.getElementById("emailAddress").focus();
				return false;
			}
			if (!myreg.test(emailAddress)) {
				alert('请输入有效的Email！');
				document.getElementById("emailAddress").focus();
				return false;
			}
			if (content == "你的 Message") {
				alert("内容不能为空");
				document.getElementById("content").focus();
				return false;
			}
			$.ajax({
				type:"post",
				url:"MailSendServlet",
				dataType:"json",
				data:"name="+name+"&emailAddress="+emailAddress+"&content="+content,
				beforeSend : function(){
					$("#sendemail").val("正在提交");
				},
				success:function(reg){
					var send=eval(reg);
					if(send['reg']=="success"){
						alert("邮件发送成功，谢谢！");
						document.getElementById("name").value="你的姓名";
						document.getElementById("emailAddress").value="你的Email";
						document.getElementById("content").value="你的 Message";
					}
					else{
						$("#sendemail").val("发送出错");
					}
				},
				error:function(XMLHttpRequest, textStatus, errorThrown){alter("注册出错");}
			}); 
		}
	</script>
	<!-- content-section-ends -->
	<!-- footer-section-starts -->
	<div class="footer">
		<div class="container">
			<div class="copy-rights text-center">
				<p>
					&copy; 2015 copyright by <a href="#" target="target_blank">WeiqiangHu</a>
				</p>
			</div>
		</div>
	</div>
	<!-- footer-section-ends -->
	<script type="text/javascript">
		$(document).ready(function() {
			$().UItoTop({
				easingType : 'easeOutQuart'
			});
	</script>
	<a href="#" id="toTop" style="display: block;"> <span
		id="toTopHover" style="opacity: 1;"> </span></a>

</body>
</html>